﻿@charset "utf-8";
@import url(listTab.css); /* 탭메뉴 css 임포트 */
html, body {margin:0;padding:0;height:100%;font-family:'나눔고딕','NanumGothicRegular','돋움',Dotum,'굴림',Gulim,Helvetica,'Apple SD Gothic Neo',AppleGothic,Sans-serif,Arial;font-size:12px;color:#666666;}
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input[type=text],textarea,p,blockquote{margin:0;padding:0;}
input[type=checkbox]{}
th,td, input,textarea,select,button{font-size:12px;color:#666666;}
table {border-spacing:0;border-collapse:collapse;border:0;}
ol,ul ,li {list-style:none;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
hr{clear:both;display:none;}
img, fieldset{border:0 none;}
div{position:relative;margin:0;padding:0;}
b, strong{font-weight:6;}
legend, caption{visibility: hidden; line-height: 0; margin: 0;padding: 0;}
.hide{font-size: 0;line-height: 0;text-indent:-9999px;visibility: hidden;}
label.hide{position:absolute; left:-2000px; overflow:hidden;}
/**:focus{outline: solid 3px red}*/

a{color:#666666;text-decoration:none;}
a:link,
a:visited{text-decoration:none;}
a:hover{text-decoration:underline;}
a:active{text-decoration:none;}

/*html.mobile{width:990px;overflow-x:hidden;overflow-y:auto;}
html.mobile body{width:990px;overflow-x:hidden;overflow-y:visible;}*/

.mobile #wrapper{overflow-x:hidden;}

/****************************************************************************
    폰트 색상
****************************************************************************/
.font-color666{color: #666666;}
.font-color777{color: #777777;}
.font-color333{color: #333333;}
.font-color.white{color:#ffffff;}
.font-color.point{color: #f97500;}

.family-dotum{font-family:'돋움',Dotum; letter-spacing: -1px;}
.family-dotum-normal{font-family:'돋움',Dotum;font-weight:400;}

.font-extraBold{font-family:'NanumGothicExtraBold';}
.font-NGBold{font-family:'NanumGothicBold';}


/****************************************************************************
    레이아웃
****************************************************************************/
body{background-color:#f9f9f9;}
body.ie7{cursor:default;background-color:#f9f9f9;}
#wrapper{margin:0;padding:0;width:100%;outline:none;}/* outline:none; 크롬에서 노란테두리 제거 */
#header{position:relative;padding:0;margin:0;width:100%;z-index:10;height:90px;}/* height:90px 한 이유는 우측 global Chart 버튼 클릭시 아래가 잘리는 문제 해결을 위해서 */
#container{position:relative;margin:0 auto;width:100%;top:-20px;}/* top:-20px; 한 이유는 우측 global Chart 버튼 클릭시 아래가 잘리는 문제 해결을 위해서 */
#footer{position:relative;padding:0;margin:0;width:100%;cursor:default;}
#footer:after{clear:both;display:block;visibility:hidden;height:0;content:"";font-size:0;}
/****************************************************************************
    header - LOGO + GNB + link
****************************************************************************/         
#header > .top-container{height:70px; background-repeat: repeat-x; min-width: 990px; width:100%;background-image:url(/save/images/common/gnb/top_container_bg.png);}
#header > .top-container > div.sub-bg {position:absolute; display: none; height:45px; min-width: 990px; width:100%; top:70px; left:0; background-color: #ffffff; border-bottom: 1px solid #d0d0d0;}
#header > .top-container > .top{min-width: 990px; max-width:1220px; width:100%; margin: 0 auto;}
.mobile #header > .top-container > .top{max-width:990px;}

#header > .top-container > .top > #logo {display:inline-block;*display:inline;zoom:1;margin-left:10px;}
#header > .top-container > .top > #logo > h1 {display:inline-block; *display:inline; zoom:1; margin-right: 31px; margin-top: 19px;}

#header > .top-container > .top > #gnb{display:block;zoom:1;vertical-align:middle;position:absolute;top:28px;left:130px;}
/*#header > .top-container > .top > #gnb ul li{display: inline-block; *display:inline; zoom:1;}*/
#header > .top-container > .top > #gnb > ul > li{display:block;float:left;/*width:55px;height:48px;*/margin-right:18px;}
/*#header > .top-container > .top > #gnb > ul > li.event{width:70px;}*/
#header > .top-container > .top > #gnb > ul > li.on {background:url(/save/images/common/gnb/gnb_d1_triangle.png) no-repeat 50% 100%;}
#header > .top-container > .top > #gnb > ul > li > a{display:block;color:#c4c4c4;font-size:18px;height:42px;font-weight:bold;text-align:center;}
#header > .top-container > .top > #gnb > ul > li > a span{padding:2px;padding-bottom:4px;}
#header > .top-container > .top > #gnb > ul > li:hover {background:url(/save/images/common/gnb/gnb_d1_triangle.png) no-repeat 50% 100%;}

  
#header > .top-container > .top > #gnb > ul > li.on > a{color:#FFF;}
#header > .top-container > .top > #gnb > ul > li.on > a span{border-bottom:2px solid #FFF;}
#header > .top-container > .top > #gnb > ul > li > a:hover{color:#FFF;text-decoration:none;}
#header > .top-container > .top > #gnb > ul > li > a:hover span{border-bottom:2px solid #FFF;}
#header > .top-container > .top > #gnb > ul > li > div.sub-navi{position: absolute; /*height: 45px;*/ min-width: 990px; /*left:0;*/ *margin-left:-30px;top:44px;}
#header > .top-container .top > #gnb > ul > li > div.sub-navi ul {margin-top: 11px;}
#header > .top-container .top > #gnb > ul > li > div.sub-navi li {display:block;float:left;margin-right:30px;}
#header > .top-container .top > #gnb > ul > li > div.sub-navi li.on {background:url('/save/images/common/gnb/gnb_d2_circle.png') no-repeat 0% 50%;padding-left:15px;}
#header > .top-container .top > #gnb > ul > li > div.sub-navi li a {display:block;color:#666;font-size:14px;font-family:'NanumGothicBold';}
#header > .top-container .top > #gnb > ul > li > div.sub-navi li.on a {color:#000;}
#header > .top-container .top > div.right{/*display:inline-block; *display:inline; zoom:1; float:right; *margin-top: -70px; */}
#header > .top-container .top > div.right{display:block;position:absolute;top:0;right:10px;}
#header > .top-container > .top > div.right > div.right-sub{display:inline-block; *display:inline; zoom:1; margin-top: 24px; *margin-top: 23px; margin-right: 70px;color:#c4c4c4; vertical-align: top;}
#header > .top-container > .top > div.right > div.right-sub > #login{position:relative;top:1px;display:inline-block;*display:inline;zoom:1;margin-right:8px;}
#header > .top-container > .top > div.right > div.right-sub > #login.loggedin{top:0;}
#header > .top-container > .top > div.right > div.right-sub > #login > a+a{margin-left: 0px;}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout{ /*vertical-align: top;*/ margin-right: 7px; *margin-right:10px;position:relative;*top:-2px;}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout,
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dt,
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dd {display: inline-block; *display:inline; zoom:1; }
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout dt {font-size: 11px;}




#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dt > label.user-id {background:url(../images/common/gnb/gnb_id.png) no-repeat;display:block;width:14px;height:9px;text-indent:-10000px;position:relative;left:17px;*left:14px;top:1px;*top:4px;top:2px\0IE9}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dt > label.user-pw {background:url(../images/common/gnb/gnb_pw.png) no-repeat;display:block;width:19px;height:9px;text-indent:-10000px;position:relative;left:21px;*left:18px;top:1px;*top:4px;top:2px\0IE9}
@-moz-document url-prefix(){
	#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dt > label.user-id {left:18px;top:3px;}
	#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dt > label.user-pw {top:3px;}
}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dd.user-id {margin-right:-17px;*margin-right:-11px;}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.logout > dd > div.input-wrapper {border-bottom:1px #444 solid;border-top-style:none;border-left-style:none;border-right-style:none;}
#header > .top-container > .top > div.right > div.right-sub > #login input{border:none;background:transparent;}
#header > .top-container > .top > div.right > div.right-sub > #login input[type=text] {width:55px;height:15px;line-height:15px;margin-left:17px;}
#header > .top-container > .top > div.right > div.right-sub > #login input[type=password] {width:51px;*width:49px;width:49px\0IE9;height:13px;line-height:13px;margin-left:21px;}/* line-height:13px; -> ie에서 동작하게 하기 위함 */
#header #login a{color:#bababa;font-weight:800; /*vertical-align:3px;*/}
/*#header #login a:hover{color:#efefef;}*/
/*#header #login a span {font-weight:bold;font-family:'NanumGothicExtraBold';font-size:12px;}*/



#header > .top-container > .top > div.right > div.right-sub > #login > a.img-logout > img{vertical-align: text-bottom;} 

#header > .top-container > .top > div.right > div.right-sub > #login > dl.login{position:relative;top:4px;margin-right: 15px; /*vertical-align: top;*/}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.login > dd > span {margin:0 7px 0 5px; *margin-left: 7px;}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.login,
#header > .top-container > .top > div.right > div.right-sub > #login > dl.login > dt,
#header > .top-container > .top > div.right > div.right-sub > #login > dl.login > dd{display: inline-block; *display:inline; zoom:1;}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.login > dt > img {margin-right:4px; *margin-right:8px; /*vertical-align: top;*/}
#header > .top-container > .top > div.right > div.right-sub > #login > dl.login > dd{ font-size:12px; text-align: center; vertical-align: top;}

#header > .top-container > .top > div.right > div.right-sub > #login > a.img-login{position:relative;top:1px;}
#header > .top-container > .top > div.right > div.right-sub > #login > a.img-login > img{vertical-align: bottom;}



#header > .top-container > .top > div.right > div.right-sub > #link{display:inline-block; *display:inline; zoom:1; margin-top: 4px; }
#header > .top-container > .top > div.right > div.right-sub > #link > ul > li{display: inline-block; *display:inline; zoom:1; margin-right: 7px;}
#header > .top-container > .top > div.right > div.right-sub > #link > ul > li > a > img{vertical-align: text-bottom;}
#header > .top-container > .top > div.right > div.right-sub > #link > ul > li > a{color:#bababa;font-size:12px;font-weight:bold;}
#header > .top-container > .top > div.right > div.movie-chart{display:inline-block;*display:inline;zoom:1;*margin-top:-4px;}
/*#header > .top-container > .top > div.right > div.movie-chart{display:block;width:53px;height:89px;position:absolute;top:0;right:0;background:url(/Content/images/Common/header/Chart/movie-chart_open.png) no-repeat;}*/
#header > .top-container > .top > div.right > div.movie-chart{display:block;position:absolute;top:0;right:0;width:53px;height:89px;}
#header > .top-container > .top > div.right > div.movie-chart > a{position:absolute;top:-11px;left:-53px;}
#header > .top-container > .top > div.right > div.movie-chart > a{top:0;left:0;display:block;width:53px;height:89px;}
/*@-moz-document url-prefix(){#header > .top-container > .top > div.right > div.movie-chart > a {position:absolute;top:-12px;}}*/
#header > .top-container > .top > div.right > div.movie-chart > a.open {}
#header > .top-container > .top > div.right > div.movie-chart > a.close {display:none;}
/*#header > .top-container > .top > div.right > div.movie-chart > a > img {position:absolute;z-index:100;}*/

/****************************************************************************
    header - Global MovieChart
****************************************************************************/
#header > div.global-chart-container{height:189px;width:100%;background-color:#383838;display:block;position:absolute;top:-190px;}
#header > div.global-chart-container > div.global-chart{height:120px;margin:0 auto;position:absolute;top:34px;width:100%;}
#header > div.global-chart-container > div.global-chart > p{cursor:pointer;display:block;zoom:1;width:29px;height:29px;position:absolute;top:46px;}
#header > div.global-chart-container > div.global-chart > p a{cursor:pointer;}
#header > div.global-chart-container > div.global-chart > p.global-prev {left:15px;}
#header > div.global-chart-container > div.global-chart > p.global-next {right:15px;}
#header > div.global-chart-container > div.global-chart > p.global-next:hover {}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite{height:120px;margin:0 50px;display:block;zoom:1;overflow:hidden;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul{position:absolute;left:0;top:0;width:100%;height:120px;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li{position:absolute;display:block;zoom:1;top:0;width:90px;height:120px}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > a{position:absolute;left:0;top:0;display:block;height:120px;z-index:1;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > a > img{width:90px;height:120px;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > div.cover{z-index:0;position:absolute;left:0;top:0px;width:90px;height:120px;background-color:#000000;filter:alpha(opacity=85);opacity:0.85;text-align:center;font-size:12px;color:#cccccc;font-family:'NanumGothicBold'}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > div.cover > p.title{margin-top:27px;/*overflow: hidden;text-overflow:ellipsis;display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; word-wrap:break-word;*/}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > div.cover > p.age{color:#f3733c;font-weight:normal;font-size:11px;margin-top:8px;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > div.cover > p.btn{position:absolute;text-align:center;width:100%;bottom:10px;left:0;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > div.cover > p.btn > a{color:#ccc;}
#header > div.global-chart-container > div.global-chart > div.global-jCarouselLite > ul > li > p.grade{position:absolute;width:17px;height:17px;background-color:#fd763b;top:0;left:0;font-size:10px;font-weight:800;color:#ffffff;line-height:17px;text-align:center;z-index:3;}




/****************************************************************************
    바로가기 메뉴
****************************************************************************/
.skip-to-content{z-index:10000; }
.accessibility{ top:-1000px; position:absolute;}
.accessibility:hover, .accessibility:focus, .accessibility:active{ 
    top:0; position:absolute;
    width:100%; display:block; text-align:center; background-color:#f0f0f0; padding-top:10px; padding-bottom:10px;   
}

 

/****************************************************************************
    본문
****************************************************************************/
/*#wrapper{background-image: url(/Content/images/Movie/Movie_Detail/tmp_poster.jpg); background-size:cover; background-repeat: no-repeat;}*/
.ie7 #container{cursor:default;}
#container > #content > #main-shortCut{/*margin-top:100px;*/ min-width: 990px;outline:none;}/* 크롬에서 노란 테두리 제거 */
#container > #content > #main-shortCut > .main-section{margin: 0 auto; width:990px; /*min-width: 990px;  max-width:1220px;*/  min-height: 104px;}
#container > #content > #main-shortCut > .sub-main-section{margin: 0 auto; width:990px; /*min-width:990px; max-width:1220px;*/ min-height: 104px; /*border:1px solid #000000;*/}

#container > #content > #main-shortCut .sub-title{margin-bottom: 20px;}
#container > #content > #main-shortCut .sub-title > h2{font-weight: 600; font-size: 18px;}
#container h2,
#container h4{font-family:'NanumGothicBold'; font-weight:bold;}
#container h4{font-size:17px;}

/****************************************************************************
    페이지 타입
****************************************************************************/
.page-type1{margin-top:105px;} /* 서브타이틀 없음 - 2depth 네비게이션 있음 */
.page-type1-1{margin-top:60px;} /* 서브타이틀 없음 - 2depth 네비게이션 없음 */

.page-type2{margin-top:60px;} /* 서브타이틀 있음 - 2depth 네비게이션 없음 */
.page-type2 > h2{margin-bottom: 18px; color:#888888; font-size: 36px; font-weight: 600; letter-spacing: -1px;}
.page-type2 > h2 > p{margin-bottom: 6px; font-size: 17px; font-weight: 700;}
.page-type2 > h2 > span{color:#333333;}
.page-type2 > div.desc{font-size: 12px; color:#666666; line-height: 16px; padding-top: 13px; padding-bottom: 15px; border-bottom: 1px solid #cccccc; border-top: 1px solid #cccccc; margin-bottom: 27px;}
.page-type2 > div.desc > p{font-size: 15px; color:#333333; font-weight: 600; margin-bottom: 8px;}

.page-type3{margin-top:60px;} /* 서브타이틀 있음 - 2depth 네비게이션 없음 */
.page-type3 > h2{margin-bottom: 28px; color:#888888; font-size: 36px; letter-spacing: -1px; font-family: 'NanumGothicBold';}
.page-type3 > h2 > p{margin-bottom: 9px; font-size: 17px; font-family: 'NanumGothicBold';}
.page-type3 > h2 > span{color:#333333;}
/****************************************************************************
    footer
****************************************************************************/   
/*       
#footer .gray-line{border-top: 1px solid #e4e4e4;}
#footer .white-line{border-top: 1px solid #ffffff;}
*/    
#footer{padding:150px 0 0;}
#footer > .container {height:157px; background-color:#f0f0f0;cursor:default; border-top: 1px solid #e4e4e4;}
#footer > .container > .contents{min-width: 990px; max-width:1220px;padding-top: 28px; margin: 0 auto; border-top:1px solid #ffffff;}
.mobile #footer > .container > .contents{max-width:990px;}
#footer > .container > .contents > .link-group > li {display: inline;}
#footer > .container > .contents > .link-group > li.policy > a {color:#d44d24; font-size:13px;}
#footer > .container > .contents > .link-group > li > div.line{display:inline;color: #c9c9c9;padding:0 7px 0 12px; }
#footer > .container > .contents > .addr{line-height: 20px;margin-top:12px;}
#footer > .container > .contents > p.copyright{margin-top: 13px;}
#footer > .container:after{ clear: both; display: block; visibility: hidden; height: 0; content:""; font-size: 0; }
#footer > .container > .contents > a > .footer-top-anchor {position:absolute;top:30px;left:100%;margin-left:-47px;}
/* 2013.11.22 WA 인증마크 */
#footer > .container > .contents .wa_standard_mark {position:absolute; width:208px; height:62px; top:30px; right:96px;}


/********************************************************************************
    Paging
*********************************************************************************/
.page-box{text-align: center;}
.page-box > a > img{vertical-align: middle;}
.page-box > a.on{text-decoration: underline; color:#000000;}
.page-box > a:hover{text-decoration: underline; color:#000000;}
.page-box > a.prev > img{margin-right:24px;}
.page-box > a.next > img{margin-left:24px;}
.page-box > a{font-size: 16px; font-weight: 600; color:#666666; margin: 0 6px;}

/**************************************************************************************
    movie-player-button
***************************************************************************************/
div.vod-container{display: inline-block; *display: inline; zoom:1;}
div.player-btn_w98_h53{position: absolute; width:27px; height:27px; left:36px; top:13px; background: url(/Content/images/Movie/player_btn_27.png) 0 0 no-repeat; font-size:0; line-height:0; text-indent:-2000px; overflow:hidden;}/* 98*53 27*27 */
div.player-btn_w150_h85{position: absolute; width:37px; height:37px; left:57px; top:24px; background: url(/Content/images/Movie/player_btn_37.png) 0 0 no-repeat; font-size:0; line-height:0; text-indent:-2000px; overflow:hidden;}/* 150*85 37*37 */
div.player-btn_w150_h215{position: absolute; width:50px; height:50px; left:50px; top:82px; background: url(/Content/images/Movie/player_btn_50.png) 0 0 no-repeat; font-size:0; line-height:0; text-indent:-2000px; overflow:hidden;}/* 150*215 50*50 */


/********************************************************************************
    Button
*********************************************************************************/

 /*border 사이즈로 인해 총 width, height 모두 -2px*/

.button{text-align: center; display: inline-block; *display: inline; zoom:1; vertical-align: middle;}
.button-list b {padding-left:15px;background:url(/Content/images/Common/button_list_bg.png) no-repeat center left;} /* 목록 버튼 */

.button.h25{font-size: 13px; height:23px; line-height: 23px;}
.button.h28{font-size: 13px; height:26px; line-height: 26px;}
.button.h29{font-size: 13px; height:27px; line-height: 27px;}
.button.h30{font-size: 14px; height:28px; line-height: 28px;}
.button.h31{font-size: 14px; height:29px; line-height: 29px;}
.button.h32{font-size: 16px; height:30px; line-height: 30px;}
.button.h45{font-size: 16px; height:43px; line-height: 43px;}
.button.h21{font-size: 12px; height:19px; line-height: 19px;}
.button.h24{font-size: 12px; height:22px; line-height: 22px;}

.button.w49{width:47px;}
.button.w59{width:57px;}
.button.w62{width:60px;}
.button.w65{width:63px;}
.button.w70{width:68px;}
.button.w75{width:73px;}
.button.w85{width:83px;}
.button.w97{width:95px;}
.button.w100{width:98px;}
.button.w112{width:100px;}
.button.w115{width:113px;}
.button.w116{width:114px;}
.button.w120{width:116px;}
.button.w122{width:118px;}
.button.w124{width:120px;}
.button.w126{width:124px;}
.button.w128{width:126px;} 
.button.w130{width:128px;}
.button.w132{width:130px;}
.button.w140{width:138px;}
.button.w144{width:142px;}
.button.w150{width:148px;}
.button.w160{width:158px;}
.button.w165{width:163px;}
.button.w190{width:188px;}
.button.w214{width:212px;}

.button.opacity{color:#414141; background-color: #f4f4f4;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; filter: alpha(opacity=90); opacity: 0.9; border: 1px solid #ffffff;}
.button.orange{color:#ffffff; background-color: #c9500d; border: 1px #c9500d solid;}
.button.orange.border{border: 1px solid #fd7c26;}/*보더 컬러 다름*/
.button.white{color:#333333;background-color: #ffffff; border: 1px #cccccc solid;}
.button.white-list{color:#000;background-color: #ffffff; border: 1px #d3d3d3 solid;} 
.button.gray{color:#ffffff;background-color: #666666; border: 1px #666666 solid;}


.button.pickup{background-image: url(/Content/images/Common/button/pickup_w116_h28.png); height:28px; width: 86px; color:#333333; padding-left: 5px; padding-right: 25px; line-height: 28px; font-size: 13px; font-weight: 600; }
/*.button.more{background-image: url(/Content/images/Common/button/more_w57_h19.png); height:19px; width: 57px;} image 태그로 대체*/
.button.close{background-image: url(/Content/images/Common/button/x_w17_h16.png); background-repeat: no-repeat; background-position: 42px 3px; padding-right: 26px; font-size: 18px; color:#ffffff;}

/* 버튼모양 박스 - label 공통 css 적용 */
.button{text-align: center; display: inline-block; *display: inline; zoom:1; vertical-align: middle; cursor:pointer;}
button.button{padding:5px 0;}
.button.h28{font-size: 13px; height:26px; line-height: 26px;}
.button.h29{font-size: 13px; height:27px; line-height: 27px;}
.button.h30{text-align:center;font-size: 13px; height:28px; line-height: 28px;}
.button.h45{font-size: 16px; height:43px; line-height: 43px;}
.button.h21{font-size: 12px; height:19px; line-height: 19px;}
.button.h23{font-size: 12px; height:21px; line-height: 21px;}
.button.h42d{font-size: 12px; height:40px; line-height: 19px;}
.button.w45{width:43px;}
.button.w59{width:57px;}
.button.w71{width:69px;}
.button.w97{width:95px;}
.button.w108{width:110px;}
.button.w214{width:212px;}
.button.w120{width:118px;}
.button.w130{width:128px;}
.button.w150{width:148px;}
.button.w160{width:158px;}
.button.opacity{color:#414141; background-color: #f4f4f4; opacity: 0.9;filter:alpha(opacity=90);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; border: 1px solid #ffffff;}
.button.orange{color:#ffffff; background-color: #d44d24; border: 1px #d44d24 solid;}
.button.orange.border{border: 1px solid #fd7c26;}/*보더 컬러 다름*/
.button.white{color:#333333;background-color: #ffffff; border: 1px #cccccc solid;}
.button.gray{color:#ffffff;background-color: #666666; border: 1px #666666 solid;}



/****************************************************************************
    점선 라인
****************************************************************************/
.dotted-line-c9c9c9,
.dotted_line_5x1_c9c9c9_png 
{background:url('/Content/images/Common/dotted_line_5x1_c9c9c9.png') repeat-x;width:100%;height:1px;}
.dotted-line-666,
.dotted_line_5x1_c666_png 
{background:url('/Content/images/Common/dotted_line_5x1_c666.png') repeat-x;width:100%;height:1px;}


/****************************************************************************
    선 라인
****************************************************************************/
.line-ccc {width:100%;height:1px;background-color:#ccc;}
.line-dcdcdc {width:100%;height:1px;background-color:#dcdcdc;}
.line-d0d0d0 {width:100%;height:1px;background-color:#d0d0d0;}
.line_e2e2e2, .line-e2e2e2 {width:100%;height:1px;background-color:#e2e2e2;}
.line_c999, .line-999 {width:100%;height:1px;background-color:#999;}
.line_cd7d7d7, .line-d7d7d7 {width:100%;height:1px;background-color:#d7d7d7;}
.line_cd7d7d7.off{background:none;}
.line-666{width:100%;height:1px;background-color:#666;}

/****************************************************************************
    구분 라인 (테이블 헤더들 구분하는 작은 세로바) |
****************************************************************************/
.seperate-line {content:'';border-right:1px solid #c9c9c9;display:inline-block;*display:inline;*zoom:1;height:12px;vertical-align:middle;}
/*.seperate-line {color:#c9c9c9;}*/

/****************************************************************************
    select-box
****************************************************************************/
.select-box{display: inline-block;  zoom:1; *display:inline;    position: relative;     background-color: #f7f7f7;  border:solid 1px #ccc;    padding: 1px 11px 0 10px;    width:150px;    height:27px;    line-height: 25px;  font-size: 13px;    vertical-align: middle; text-align: left; background-color: #fff; color:#666666; }
.select-box{background-image: url('/Content/images/common/selectbox-btn.png');  background-repeat: no-repeat;   background-position : 75px 50%;}
.select-box select{-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";   filter: alpha(opacity=0);   opacity: 0; width:100%; height:100%;    position: absolute; top:0; left:0; font-weight: normal; color: #666;}
.select-box.hover{border:solid 1px #ccc;}
/*.select-box select:active {border:solid 1px #ccc;}*/


/****************************************************************************
    input-box
****************************************************************************/
div.input-box input[type=text],
div.input-box input[type=password], 
div.input-box textarea, 
input[type=text].input-box,
input[type=password].input-box
 {width:150px;color:#666;height:16px;line-height:16px;font-size:12px;border:1px solid #ccc;background-color:#fff;padding:6px 9px;vertical-align:bottom;} /* input box 공통 스타일 */

div.input-box {margin:0 auto;}
div.input-box dt {float:left;width:120px;font-size:13px;color:#202020;font-weight:600;margin-top:7px;}

/****************************************************************************
    hyphen
****************************************************************************/
.mid-hyphen {display:inline-block; *zoom:1;*display:inline; border-top:1px solid #333;width:5px;position:relative;top:-3px;margin:0 1px;.margin-right:4px;*top:8px;} /* 주민번호 등의 두 input-box 사이에 들어가는 하이픈 */



/****************************************************************************
    팝업 공통 (회원가입 등)
****************************************************************************/
#header > .popup-top-container {height:50px; background-color: #0e0e0e; min-width: 500px;}
#header > .popup-top-container > .popup-top {min-width: 500px; margin: 0 auto;}
#header > .popup-top-container > .popup-top h1 {display:inline-block;*display:inline;*zoom:1;font-size:20px;font-weight:600;color:#fff;margin-top:12px;margin-left:20px;}
#header > .popup-top-container > .popup-top > div.right{display:inline-block; *display:inline; zoom:1; float:right; *margin-top: -70px; }
#header > .popup-top-container > .popup-top div.popup-close-button {margin-top:15px;margin-right:12px;}

#popup,
#popup-container {background:#fff;}


/****************************************************************************
    margin
****************************************************************************/
/*margin-top*/
.margin-top0{margin-top : 0;}
.margin-top5{margin-top : 5px;}
.margin-top8{margin-top : 8px;}
.margin-top9{margin-top : 9px;}
.margin-top10{margin-top : 10px;}
.margin-top12{margin-top : 12px;}
.margin-top13{margin-top : 13px;}
.margin-top15{margin-top : 15px;}
.margin-top18{margin-top : 18px;}
.margin-top20{margin-top : 20px;}
.margin-top25{margin-top : 25px;}
.margin-top28{margin-top : 28px;}
.margin-top30{margin-top : 30px;}
.margin-top35{margin-top : 35px;}
.margin-top40{margin-top : 40px;}
.margin-top44{margin-top : 44px;}
.margin-top45{margin-top : 45px;}
.margin-top50{margin-top : 50px;}
.margin-top55{margin-top : 55px;}
.margin-top60{margin-top : 60px;}
.margin-top65{margin-top : 65px;} 
.margin-top70{margin-top : 70px;}
.margin-top80{margin-top : 80px;}
.margin-top85{margin-top : 85px;}
.margin-top90{margin-top : 90px;}
.margin-top95{margin-top : 95px;}
.margin-top100{margin-top : 100px;}
.margin-top110{margin-top : 110px;}
.margin-top120{margin-top : 120px;}
.margin-top130{margin-top : 130px;}
.margin-top140{margin-top : 140px;}
.margin-top150{margin-top : 150px;}
.margin-top160{margin-top : 160px;}
.margin-top170{margin-top : 170px;}
.margin-top180{margin-top : 180px;}
.margin-top190{margin-top : 190px;}
.margin-top200{margin-top : 200px;} 

/*margin-bottom*/
.margin-bottom5{margin-bottom : 5px;}
.margin-bottom10{margin-bottom : 10px;}
.margin-bottom12{margin-bottom : 12px;}
.margin-bottom15{margin-bottom : 15px;}
.margin-bottom18{margin-bottom : 18px;}
.margin-bottom20{margin-bottom : 20px;}
.margin-bottom22{margin-bottom : 22px;}
.margin-bottom23{margin-bottom : 23px;}
.margin-bottom25{margin-bottom : 25px;}
.margin-bottom28{margin-bottom : 28px;}
.margin-bottom30{margin-bottom : 30px;}
.margin-bottom35{margin-bottom : 35px;}
.margin-bottom40{margin-bottom : 40px;}
.margin-bottom45{margin-bottom : 45px;}
.margin-bottom50{margin-bottom : 50px;}
.margin-bottom60{margin-bottom : 60px;}
.margin-bottom70{margin-bottom : 70px;}
.margin-bottom80{margin-bottom : 80px;}
.margin-bottom90{margin-bottom : 90px;}
.margin-bottom100{margin-bottom : 100px;}
.margin-bottom110{margin-bottom : 110px;}
.margin-bottom120{margin-bottom : 120px;}
.margin-bottom130{margin-bottom : 130px;}
.margin-bottom140{margin-bottom : 140px;}
.margin-bottom150{margin-bottom : 150px;}
.margin-bottom160{margin-bottom : 160px;}
.margin-bottom170{margin-bottom : 170px;}
.margin-bottom180{margin-bottom : 180px;}
.margin-bottom190{margin-bottom : 190px;}
.margin-bottom200{margin-bottom : 200px;}

/*margin-left*/
.margin-left5 {margin-left : 5px;}
.margin-left10 {margin-left : 5px;}

/*margin-right*/
.margin-right5 {margin-right: 5px;}
.margin-right10 {margin-right: 10px;}




/****************************************************************************
    차트와 하단 분리(레이아웃 깨짐 방지)  <div class="clear_both"></div>
****************************************************************************/
.clear_both {clear:both;}


/****************************************************************************
    말줄임표 (width값 고정으로 넣고 하단 클래스 사용.) 
    사용 예:<p class="title ellipsis">; title 클래스에 width값 고정으로 되어 있음.
****************************************************************************/
.ellipsis {text-overflow:ellipsis; overflow: hidden; white-space: nowrap; } 


/* IR */
.imageReplaceClass {
        position:absolute; width:0; height:0; font-size:0; line-height:0;
        overflow:hidden; visibility:hidden;
}

/****************************************************************************
    레이어팝업
****************************************************************************/ 
.layer-pop {position:absolute;display:none;z-index:10;top:-170px;left:175px;}
.layer-pop.email-reject .popup-bg {width:410px; height:178px; padding:16px 0 0; background:url(/Content/images/Common/layer_popup_black.png) no-repeat center;}
.ie7 .layer-pop.email-reject .popup-bg {height:168px; padding-top:26px;}
.layer-pop.email-reject .close {position:absolute; right:15px; top:10px;} 
.layer-pop.email-reject p {color:#fff;text-align:center;font-weight:200;line-height:1.5em;}
.layer-pop.email-reject p span {color:#ccc;} 


button::-moz-focus-inner{padding:0;}
button{display:inline-block; padding:0; margin:0; background:none; font-family:'나눔고딕','NanumGothicRegular'; border:0; cursor:pointer; overflow:visible;}
 
/* loading */
.loading {background:transparent url('/Content/images/Common/loading.png') no-repeat 50% !important;}

p.button{cursor:default;}
a p.button{cursor:pointer;}

.verticalError{vertical-align: 7px;}

.hyphen{display:inline-block; width:10px; text-align:center; font-size:20px; vertical-align:2px;}
.ie .hyphen{vertical-align:2px;}
.ie7 .hyphen{line-height:32px;}

.errorPage{padding:120px 0 0; text-align:center;}
.errorPage h2{padding:0 0 30px; color:#000; font-size:22px; font-weight:bold;}
.errorPage h2 strong{color:#d75914;}
.errorPage .box{width:752px; margin:0 auto; padding:35px 0 30px; font-size:14px; line-height:21px; border:1px solid #d3d3d3;}
.errorPage .box strong{display:block; padding:18px 0 0; font-weight:800;}
.errorPage .button{padding:0 20px; margin:32px 4px 0;}



/* 우측 플로팅 메뉴 */
div.right-wing{text-align: center; position: absolute;z-index:20; left:95%; top:318px;background:url(/Content/images/Main/right_wing_bg.png) no-repeat;width:47px;height:287px;}
div.right-wing > ul > li{margin-bottom: 9px; text-align: center;margin-top: 4px;}
div.right-wing > ul > li.anchor{margin:0 0 2px;}
div.right-wing > ul > li.anchor a{display:inline-block; width:19px; margin:0 auto;}
div.right-wing > ul > li.frist-anchor{margin: 28px 0 2px;}
div.right-wing > ul > li.wing-top{margin:20px 0 0;}